<template>
	<view>
		<!-- 绑定次数超出前 -->
		<uni-popup ref="binds22" type="center" :isMaskClick='false'>
			<view class="uni-popup-wrapper" style="">
				<view class="uni-popup-title">
					温馨提示
				</view>
				<view class="uni-popup-content">
					<!-- #ifdef MP-WEIXIN -->
					<!-- <rich-text :nodes="datas.content"></rich-text> -->
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<!-- <p v-html="datas.content"></p> -->
					<!-- #endif -->
					<!-- <view class="" style="white-space: nowrap;">
						同一车牌号6个月内可绑定<text class="uni-popup-mark">3</text>次二维码
					</view>
					<view class="">
						超出将无法绑定，请谨慎操作。
					</view>
					<view class="">
						本次为第<text class="uni-popup-mark">2</text>次绑定
					</view> -->
				</view>
				<button class="uni-popup-btn-one cu-btn"> 确定</button>
			</view>
		</uni-popup>
		<!-- 绑定次数超出后 -->
		<uni-popup ref="binds1" type="center" :isMaskClick='false'>
			<view class="uni-popup-wrapper" style="">
				<view class="uni-popup-title">
					温馨提示
				</view>
				<view class="uni-popup-content">
					<!-- #ifdef MP-WEIXIN -->
					<!-- <rich-text :nodes="datas.content"></rich-text> -->
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<!-- <p v-html="datas.content"></p> -->
					<!-- #endif -->
					<!-- <view class="" style="white-space: nowrap;">
						同一车牌号6个月内可绑定3次二维码
					</view>
					<view class="">
						您已超出限制次数，无法绑定
					</view>
					<view class="">
						XX天后可再次绑定
					</view> -->
				</view>
				<button class="uni-popup-btn-one cu-btn"> 确定</button>
			</view>
		</uni-popup>

		<!-- 礼品送货通知  礼品退货通知 -->
		<uni-popup ref="binds" type="center" :isMaskClick='true'>
			<view class="uni-popup-wrapper" style="padding: 60rpx 32rpx 32rpx 32rpx;">
				<view class="uni-popup-title" style="color: #000000;margin-bottom: 45rpx;margin-top: 0;">
					礼品送货通知
				</view>
				<button class="uni-popup-btn-one cu-btn" style="width: 240rpx;height: 60rpx;border-radius: 37rpx 37rpx 37rpx 37rpx;background-color: transparent;color: #64B6A8;font-size: 30rpx;font-weight: 400;
opacity: 1;border: 2rpx solid #64B6A8;margin-bottom: 0;">查看详情</button>
			</view>
		</uni-popup>
		<!-- 领完弹窗|领完异常弹窗 -->
		<uni-popup ref="binds2" type="center" :isMaskClick='false'>
			<view class="uni-popup-wrapper" style="padding: 0 46rpx;">
				<view class="uni-popup-title" style="line-height:45rpx;">
					会员礼品赠送
				</view>
				<image src="https://pic.bangbangtongcheng.com/static/member/popup-warn.png" mode="aspectFill"
					style="width: 255rpx;height: 141rpx;margin: 12rpx auto 0;"></image>
				<view class="uni-popup-tip" style="" v-if="true">
					账号异常
				</view>
				<view class="uni-popup-content" style="padding: 0rpx 0 30rpx 0;font-size: 28rpx;line-height: 39rpx;">
					<view class="" style="white-space: nowrap;">
						{{true?'请提醒会员登录帮帮同城确认':'本月礼品已全部领取。敬请期待下月好礼'}}

					</view>
				</view>
				<button class="uni-popup-btn-one cu-btn">确定</button>
			</view>
		</uni-popup>

		<!-- 车主领取弹窗-->
		<uni-popup ref="binds2" type="center" :isMaskClick='false'>
			<view class="uni-popup-wrapper" style="padding: 0;">
				<view class="uni-popup-title" style="line-height:45rpx;">
					会员礼品赠送
				</view>
				<view class="uni-popup-content" style="padding: 20rpx;font-size: 28rpx;color: #666666;">
					<view class="" style="">
						您于2022年11月10日14: 57 在xx修车店领取帮帮同城11月赠礼
					</view>
				</view>
				<view class="uni-popup-seperate" style="margin: 0 22rpx;height: 0; border: 1rpx solid #D8D8D8;"></view>
				<view class="uni-popup-list">
					<view class="uni-popup-item">
						<view class="uni-popup-item-name">洗车券</view>
						<view class="uni-popup-item-num">X1</view>
					</view>
					<view class="uni-popup-item">
						<view class="uni-popup-item-name">玻璃水</view>
						<view class="uni-popup-item-num">X1</view>
					</view>
				</view>
				<view class="uni-popup-btn-wrapper">
					<button class="uni-popup-btn cu-btn left">查看详情</button>
					<button class="uni-popup-btn cu-btn right">知道了</button>
				</view>
			</view>
		</uni-popup>

		<!-- 商家拒绝弹窗 -->
		<uni-popup ref="binds" type="center" :isMaskClick='false'>
			<view class="uni-popup-wrapper" style="padding: 0 46rpx;">
				<view class="uni-popup-title" style="font-size: 32rpx;line-height:45rpx;color: #000000;">
					{{true?'礼品送货拒绝通知':'礼品退货拒绝通知'}}

				</view>

				<view class="uni-popup-content"
					style="padding: 34rpx  0;font-size: 28rpx;line-height: 39rpx;color: #000000;text-align: center;">
					<view class="" style="white-space: nowrap;">
						{{true?'商家拒绝了您发起的送货，请及时联系':'商家拒绝了您发起的退货，请及时联系'}}

					</view>
				</view>
				<button class="uni-popup-btn-one cu-btn" style="
					width: 240rpx;
					height: 60rpx;
					line-height: 60rpx;
					background: #64B6A8;
					border-radius: 37rpx 37rpx 37rpx 37rpx;
					font-size: 30rpx;
					font-weight: 400;
					color: #FFFFFF;
				"> 确定</button>
			</view>
		</uni-popup>
		<!-- 删除员工提示-->
		<uni-popup ref="binds1" type="center" :isMaskClick='false'>
			<view class="uni-popup-wrapper" style="padding: 0;">
				<view class="uni-popup-title" style="line-height:45rpx;margin-top: 79rpx;margin-bottom: 79rpx;">
					确定删除该员工?
				</view>
				<view class="uni-popup-btn-wrapper">
					<button class="uni-popup-btn cu-btn left" @click="leftBtn">取消</button>
					<button class="uni-popup-btn cu-btn right" @click="rightBtn">确认</button>
				</view>
			</view>
		</uni-popup>

		<uni-popup ref="binds" type="center" :isMaskClick='false'>
			<view class="uni-popup-wrapper" style="padding: 0 46rpx;">
				<view class="uni-popup-title" style="line-height:45rpx;">
					会员礼品赠送
				</view>
				<image
					:src="assa==1?'https://pic.bangbangtongcheng.com/static/bbcz/expression_02.png':assa==2?'https://pic.bangbangtongcheng.com/static/bbcz/expression_01.png':'https://pic.bangbangtongcheng.com/icon/expression_04.png'"
					mode="widthFix" style="width:78rpx;height: 78rpx;margin: 50rpx auto 0;"></image>
				<view class="uni-popup-tip" style="margin-top: 10rpx;margin-bottom: 16rpx;color: #3D3D3D;font-size: 26rpx;" v-if="assa==2">
					账号异常
				</view>
				<view class="uni-popup-tip high" style="margin-top: 10rpx;margin-bottom: 22rpx;color: #3D3D3D;font-size: 26rpx;" v-if="assa==1">
					领取成功
				</view>
				<view class="uni-popup-content" style="padding: 0rpx 0 30rpx 0;font-size: 28rpx;line-height: 39rpx;">
					<template v-if="assa==1">
						<view class="" style="margin-bottom: 6rpx;"><span style="color:#64B6A8;margin-right:20rpx;">领取时间</span>{{datetime}}</view>
						<view class=""><span style="color:#64B6A8;margin-right:20rpx;">领取方式</span> 到店领取</view>
					</template>
					<template v-if="assa==2">
						<view class="" style="white-space: nowrap;">
							请提醒会员登录帮帮同城确认
						</view>
					</template>
					<template v-if="assa==3">
						<view class="" style="white-space: nowrap;margin-top: 40rpx;">
							本月礼品已全部领取。敬请期待下月好礼
						</view>
					</template>

				</view>
				<button class="uni-popup-btn-one cu-btn">确定</button>
			</view>
		</uni-popup>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				assa:1,
				bindNum: 2,
				datetime: '',
			};
		},
		onReady() {
			// this.$refs.binds.open() 
		},
		methods:{
			open(type){
				this.$refs[type]&&this.$refs[type].open()
			},
			close(type){
				this.$refs[type]&&this.$refs[type].close()
			},
			leftBtn(){
				this.$emit('leftBtn')
			},
			rightBtn(){
				this.$emit('rightBtn')
			}
		}
	}
</script>

<style lang="scss">
	.uni-popup-wrapper {
		width: 600rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		opacity: 1;
		padding: 0 32rpx;
		text-align: center;
		overflow: hidden;
	}

	.uni-popup-title {
		margin-top: 32rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #333333;
		line-height: 30rpx;
	}

	.uni-popup-content {
		padding: 30rpx 32rpx 40rpx 32rpx;
		font-size: 28rpx;
		font-weight: 400;
		color: #333333;
		line-height: 42rpx;

	}

	.uni-popup-btn-one {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		background: #64B6A8;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
		opacity: 1;
		font-size: 30rpx;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 30rpx;
		margin-bottom: 32rpx;
	}

	.uni-popup-mark {
		color: #E00000;
	}

	.uni-popup-tip {
		font-size: 20rpx;
		font-weight: 400;
		color: #999999;
		line-height: 28rpx;
		margin: 10rpx auto;
	}

	.uni-popup-btn-wrapper {
		display: flex;
		width: 100%;
	}

	.uni-popup-btn {
		flex: 1;
		height: 90rpx;
		line-height: 90rpx;
		font-size: 30rpx;
		font-weight: 400;
		opacity: 1;
		border-radius: 0;

		&.left {
			background: #F2F2F2;
			color: #333333;
		}

		&.right {
			background: #64B6A8;
			color: #FFFFFF;
		}
	}

	.uni-popup-list {
		margin: 0 22rpx 32rpx 22rpx;

		.uni-popup-item {
			margin-top: 20rpx;

			font-size: 28rpx;
			font-weight: 400;
			color: #333333;
			line-height: 39rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
	}
	
	
</style>